<!--
 * @Author: your name
 * @Date: 2020-08-02 14:09:07
 * @LastEditTime: 2020-10-18 15:21:11
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \project\羊绒产业园\源码\src\views\sendList.vue
-->
<template>
  <div class="send-list">
    <heads title="我的发布"></heads>
        <van-tabs color="#5bbd97" v-model="tabIndex">
  <van-tab v-for="(labelItem,labelIndex) in labelList"
            :key="labelIndex" :title="labelItem.text" >
            <div class="nav-place-holder" :style="{height:'44px'}"></div>
  <div class="main-content">
      <van-pull-refresh v-model="isLoading" @refresh="getData">
        <template v-if="!isLoading && list && list.length>0">
          <Cell
            :ListData="item"
            v-for=" (item,index) in list"
            :key="index"
            :Type="labelIndex+1"
            @refresh="getData"
            @getData="getData"
            
          ></Cell>
        </template>
       <van-empty v-if="!isLoading && list.length <= 0" description="没有更多数据了~" />
            <!-- <van-loading size="24px" v-if="isLoading">加载中...</van-loading> -->
      </van-pull-refresh>
    </div>
  </van-tab>
</van-tabs>
    
  
  </div>
</template>

<script>
import { Toast, Popup, Picker, Search, Loading, Dialog,Empty  } from "vant";
import * as Config from "@/js/common/config";
import { mapState } from "vuex";

export default {
  components: {
    heads: resolve => require(["@/components/common/heads"], resolve),
    foots: resolve => require(["@/components/common/foots"], resolve),
    Cell: resolve => require(["@/components/common/cell"], resolve)
  },
  data() {
    return {
      isLoading: true,
      pageNo:1,
      pageSize:10,
      tabIndex:0,
       issueType:'',// 发布类型 
      tradeStatus:'',// 1 交易中 2 交易完成 3 已过期
      tradeUser:'',// 交易用户
      list: [],
       labelList:Config.getSendType()
    };
  },
  watch: {
    '$route.query.type':{
      handler(newVal,oldVal){
        window.scrollTo(0,0);
        if(newVal !== '4'){
          this.getData();
          return
        }
        this.getCollectData()
       
         
      },
      immediate:true

    },
     'tabIndex':{
      handler(newVal,oldVal){
       window.scrollTo(0,0);
        this.getData();
      },
     

    },
  },
  computed: {
    ...mapState(["userInfo"])
  },
  methods: {

    // 我发布的  我卖出的 我买到的
    getData() {
      let _this = this;
      _this.isLoading = true;
      let _param = {
         "type": Number(_this.$route.query.type),
         "salesType":(_this.tabIndex+1),
         userId: _this.userInfo.userId,
          "pageNo": _this.pageNo,
          "pageSize": _this.pageSize,
          
      }
      this.$ajax
        .post(`${this.$baseUrl}/portal/users/getUserIssueList`, _param)
        .then(function(res) {
          _this.isLoading = false;
          if (res.data.code == 200) {
            _this.list = res.data.data.list;
          }
        })
        .catch(function(error) {
           _this.isLoading = false;
          console.log(error);
        });
    },
     // 我收藏的
    getCollectData() {
      let _this = this;
      _this.isLoading = true;
      let _param = {
        
          "pageNo": _this.pageNo,
          "pageSize": _this.pageSize,
          
      }
      this.$ajax
        .post(`${this.$baseUrl}/portal/users/getCollectList`, _param)
        .then(function(res) {
          _this.isLoading = false;
          if (res.data.code == 200) {
            _this.list = res.data.data.list;
          }
        })
        .catch(function(error) {
           _this.isLoading = false;
          console.log(error);
        });
    },
   
   
  },
  created() {
   
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.send-list {
    /deep/ .van-tabs__wrap{
    position: fixed;
    width: 100%;
    z-index: 1;
  }
  .main-content {
    min-height: 92vh;
    margin-top: 0;
    padding: 0.3rem 0;
    box-sizing: border-box;
  }
  
  .tabs {
    box-sizing: border-box;
    color: #333333;
    .cell {
    }
  }
}
</style>
